<template>
	<view style="width:100%;height:90rpx"></view>
	<view class="center bot">
		<view class="column" v-for="(item, index) in list" :key="index" @click="navTo(item.puah)">
			<image :src="active === index ? item.icons : item.icon" mode=""></image>
			<text :style="{ color: active === index ? '#158AF7' : '' }">{{ item.text }}</text>
		</view>
	</view>
	<!-- 呼叫安蓝 -->
	<dragImg :type="'call'" @btnClick="navTo('callBack/call')"></dragImg>
</template>

<script setup lang="ts">
	import { navTo } from '@/utils/navigator';
	import dragImg from '@c/drag-button/drag-img.vue';
	const props = defineProps({
		active: Number,
	});
	const list = [
		{
			icon: '../../static/bottom/iconaa.png',
			icons: '../../static/bottom/icona.png',
			text: '加注',
			puah: 'index/filling',
		},
		{
			icon: '../../static/bottom/icon66.png',
			icons: '../../static/bottom/icon6.png',
			text: '车友团',
			puah: 'index/teamIndex',
		},
		{
			icon: '../../static/bottom/icon7.png',
			icons: '../../static/bottom/icon77.png',
			text: '卡车商城',
			puah: 'index/shopp',
		},
		{
			icon: '../../static/bottom/icon45.png',
			icons: '../../static/bottom/icon4.png',
			text: '车上生活',
			puah: 'index/gemstone',
		},
		{
			icon: '../../static/bottom/icond.png',
			icons: '../../static/bottom/icondd.png',
			text: '我的',
			puah: 'index/mine'
		},
	];
</script>

<style scoped lang="less">
	.bot {
		width: 100%;
		background: #fff;
		height: 90rpx;
		position: fixed;
		z-index: 99;
		bottom: 0px;
		left: 0px;
		justify-content: space-around;

		image {
			width: 40rpx;
			height: 40rpx;
		}

		text {
			font-size: 24rpx;
			margin-top: 2rpx;
		}
	}
</style>